import 'package:flutter/material.dart';
import 'screens/home_screen.dart';
import 'screens/product_screen.dart';
import 'screens/cart_screen.dart';
import 'screens/profile_screen.dart';

/// 应用入口函数
/// 这是Flutter应用的启动点，调用runApp启动应用
void main() {
  runApp(const WidgetLearningApp());
}

/// 主应用Widget
/// 负责配置应用的主题、路由等全局设置
class WidgetLearningApp extends StatelessWidget {
  const WidgetLearningApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Widget 学习',
      // 移除调试标记，让应用看起来更专业
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        // 使用Material 3设计系统，基于种子颜色生成完整的颜色方案
        colorScheme: ColorScheme.fromSeed(
          seedColor: Colors.blue, // 种子颜色，系统会自动生成配套的颜色
          brightness: Brightness.light, // 亮色主题
        ),
        useMaterial3: true, // 启用Material 3设计
        // 定义响应式字体大小，在不同设备上自动调整
        textTheme: const TextTheme(
          headlineLarge: TextStyle(
            fontSize: 32,
            fontWeight: FontWeight.bold,
          ), // 大标题
          headlineMedium: TextStyle(
            fontSize: 24,
            fontWeight: FontWeight.w600,
          ), // 中标题
          headlineSmall: TextStyle(
            fontSize: 20,
            fontWeight: FontWeight.w500,
          ), // 小标题
          bodyLarge: TextStyle(fontSize: 16), // 大正文
          bodyMedium: TextStyle(fontSize: 14), // 中正文
          bodySmall: TextStyle(fontSize: 12), // 小正文
        ),
      ),
      home: const MainNavigationScreen(), // 设置应用的主页面
    );
  }
}

/// 主导航屏幕
/// 使用StatefulWidget管理底部导航栏的状态
class MainNavigationScreen extends StatefulWidget {
  const MainNavigationScreen({super.key});

  @override
  State<MainNavigationScreen> createState() => _MainNavigationScreenState();
}

/// 主导航屏幕的状态管理类
class _MainNavigationScreenState extends State<MainNavigationScreen> {
  // 当前选中的导航项索引
  int _currentIndex = 0;

  // 定义所有页面，使用const提高性能
  final List<Widget> _screens = [
    const HomeScreen(), // 首页
    const ProductScreen(), // 商品页
    const CartScreen(), // 购物车页
    const ProfileScreen(), // 个人中心页
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 使用IndexedStack保持页面状态，避免页面重建
      body: IndexedStack(
        index: _currentIndex, // 当前显示的页面索引
        children: _screens, // 所有页面列表
      ),
      // Material 3风格的底部导航栏
      bottomNavigationBar: NavigationBar(
        selectedIndex: _currentIndex, // 当前选中的索引
        onDestinationSelected: (index) {
          // 当用户点击导航项时更新状态
          setState(() {
            _currentIndex = index;
          });
        },
        // 定义导航项
        destinations: const [
          NavigationDestination(
            icon: Icon(Icons.home_outlined), // 未选中时的图标
            selectedIcon: Icon(Icons.home), // 选中时的图标
            label: '首页',
          ),
          NavigationDestination(
            icon: Icon(Icons.shopping_bag_outlined),
            selectedIcon: Icon(Icons.shopping_bag),
            label: '商品',
          ),
          NavigationDestination(
            icon: Icon(Icons.shopping_cart_outlined),
            selectedIcon: Icon(Icons.shopping_cart),
            label: '购物车',
          ),
          NavigationDestination(
            icon: Icon(Icons.person_outline),
            selectedIcon: Icon(Icons.person),
            label: '我的',
          ),
        ],
      ),
    );
  }
}
